<!-- <template>
    <div ref="box"></div>
</template> -->

<script>
// import Vue from 'vue';
// import createToo
// '@/components/wangeditor/components/Toolbar' npm i @wangeditor/editor
const { createEditor, createToolbar } = window.wangEditor
export default {
    name: 'EditorToolbar',
    render (h) {
        return h('div', { ref: 'box' });
    },
    props: ['editor', 'defaultConfig', 'mode'],
    methods: {
    // 创建 toolbar
        create (editor) {
            if (this.$refs.box == null) return;
            if (editor == null) return;
            if (DomEditor.getToolbar(editor)) return; // 不重复创建

            createToolbar({
                editor,
                selector: this.$refs.box,
                config: this.defaultConfig || {},
                mode: this.mode || 'default'
            });
        }
    },
    watch: {
        editor: {
            handler (e) {
                if (e == null) return;
                this.create(e);
            },
            immediate: true
        }
    }
};

</script>